<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="include :: header('课题批阅')"/>
    <th:block th:include="include :: datetimepicker-css"/>
    <th:block th:include="include :: bootstrap-fileinput-css"/>
    <th:block th:include="include :: select2-css"/>
</head>
<body class="white-bg">
<div class="wrapper wrapper-content animated fadeInRight ibox-content">
    <form class="form-horizontal m" id="form-apply-edit" th:object="${sciIntraSchoolPro}">
        <input name="urlFlag" id="urlFlag" th:field="*{urlFlag}" type="hidden">
        <input name="state" id="state" th:field="*{state}" type="hidden">
        <input name="id" id="ktid" th:field="*{id}" type="hidden">
        <input name="role" id="role" th:field="*{role}" type="hidden">
        <h4 class="form-header h4">基本信息</h4>
        <div class="row">
            <div class="col-xs-6">
                <div class="form-group">
                    <label class="col-sm-4 control-label is-required">申请人：</label>
                    <div class="col-sm-8">
                        <input readonly th:field="*{userName}" class="form-control" type="text">
                        <!--                    <select name="userId" class="form-control m-b" readonly >-->
                        <!--                        <option th:each="user : ${sysUsers1}" th:text="${user.userName}" th:value="${user.userId}" th:selected="${ user.userId == sciIntraSchoolPro.userId}"></option>-->
                        <!--                    </select>-->
                    </div>
                </div>
            </div>

            <div class="col-xs-6">
                <div class="form-group">
                    <label class="col-sm-4 control-label is-required">课题类型：</label>
                    <div class="col-sm-8">

                        <select readonly class="form-control" th:with="type=${@dict.getType('sci_top_type')}" required
                                disabled>
                            <option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}"
                                    th:field="*{topType}"></option>
                        </select>
                    </div>
                </div>
            </div>
            <div class="col-xs-6">
                <div class="form-group">
                    <label class="col-sm-4 control-label is-required">课题名称：</label>
                    <div class="col-sm-8">
                        <input readonly th:field="*{topName}" class="form-control" type="text" required>
                    </div>
                </div>
            </div>
            <div class="col-xs-6">
                <div class="form-group">
                    <label class="col-sm-4 control-label is-required">项目金额：</label>
                    <div class="col-sm-8">
                        <input readonly th:field="*{amount}" class="form-control" type="text" required>
                    </div>
                </div>
            </div>


            <div class="col-xs-6">
                <div class="form-group">
                    <label class="col-sm-4 control-label is-required">甲方：</label>
                    <div class="col-sm-8">
                        <input readonly th:field="*{pa}" class="form-control" type="text" required>
                    </div>
                </div>
            </div>

            <div class="col-xs-6">
                <div class="form-group">
                    <label class="col-sm-4 control-label is-required">乙方：</label>
                    <div class="col-sm-8">
                        <input readonly th:field="*{pb}" class="form-control" type="text" required>
                    </div>
                </div>
            </div>

            <div class="col-xs-6">
                <div class="form-group">
                    <label class="col-sm-4 control-label is-required">签订日期：</label>
                    <div class="col-sm-8">
                        <div class="input-group date">
                            <input readonly th:field="*{signingData}"
                                   th:value="${#dates.format(signingData, 'yyyy-MM-dd')}" class="form-control"
                                   placeholder="yyyy-MM-dd" type="text" required>
                           <!-- <span class="input-group-addon"><i class="fa fa-calendar"></i></span>-->
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-xs-6">
                <div class="form-group">
                    <label class="col-sm-4 control-label is-required">合同有效日期：</label>
                    <div class="col-sm-8">
                        <div class="input-group date">
                            <input readonly th:field="*{createtime}"
                                   th:value="${#dates.format(createtime, 'yyyy-MM-dd ')}" class="form-control"
                                   placeholder="yyyy-MM-dd " type="text" required>
                            <!--<span class="input-group-addon"><i class="fa fa-calendar"></i></span>-->
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-xs-6">
                <div class="form-group">
                    <label class="col-sm-4 control-label is-required">第一负责人：</label>
                    <div class="col-sm-8">

                        <!--                        <input name="firstPersonId" th:field="*{firstPersonId}" class="form-control" type="text" required>-->
                        <select name="firstPersonId" class="form-control m-b" disabled>
                            <option th:each="user : ${sysUsers1}" th:text="${user.userName}" th:value="${user.userId}"
                                    th:selected="${ #strings.toString(user.userId) == sciIntraSchoolPro.firstPersonId}"></option>
                        </select>
                    </div>
                </div>
            </div>

            <div class="col-xs-6">
                <div class="form-group">
                    <label class="col-sm-4 control-label is-required">第二负责人：</label>
                    <div class="col-sm-8">
                        <!--                        <input name="secondPersonTask" th:field="*{secondPersonTask}" class="form-control" type="text" required>-->
                        <select name="secondPersonId" class="form-control m-b" disabled>
                            <option th:each="user : ${sysUsers1}" th:text="${user.userName}" th:value="${user.userId}"
                                    th:selected="${ #strings.toString(user.userId) == sciIntraSchoolPro.secondPersonId}"></option>
                        </select>
                    </div>
                </div>
            </div>

            <div class="col-xs-6">
                <div class="form-group">
                    <label class="col-sm-4 control-label is-required">第三负责人：</label>
                    <div class="col-sm-8">
                        <!--                        <input name="thirdPersonId" th:field="*{thirdPersonId}" class="form-control" type="text" required>-->
                        <select class="form-control m-b" disabled>
                            <option th:each="user : ${sysUsers1}" th:text="${user.userName}" th:value="${user.userId}"
                                    th:selected="${ #strings.toString(user.userId) == sciIntraSchoolPro.thirdPersonId}"></option>
                        </select>
                    </div>
                </div>
            </div>

            <div class="col-xs-6">
                <div class="form-group">
                    <label class="col-sm-4 control-label is-required">第四负责人：</label>
                    <div class="col-sm-8">
                        <!--                        <input name="fourthPersonId" th:field="*{fourthPersonId}" class="form-control" type="text" required>-->
                        <select class="form-control m-b" disabled>
                            <option th:each="user : ${sysUsers1}" th:text="${user.userName}" th:value="${user.userId}"
                                    th:selected="${ #strings.toString(user.userId) == sciIntraSchoolPro.fourthPersonId}"></option>
                        </select>
                    </div>
                </div>
            </div>


            <div class="col-xs-6">
                <div class="form-group">
                    <label class="col-sm-4 control-label is-required">合同：</label>
                    <div class="col-sm-8">
                        <input th:field="*{overContract}" hidden id="filing" type="text">
                        <!--                    <span id="filingFileName" class="form-control" readonly></span>-->
                        <div style="display:inline-block;">
                            <div id="filingFileName" style="display: inline; margin-right: 5px;"></div>
                            <button onclick="chakan()"
                                    class="btn btn-primary">
                                预览
                            </button>
                            <button onclick="downloadFile('filing')"
                                    class="btn btn-primary">
                                下载
                            </button>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-xs-6">
                <div class="form-group">
                    <label class="col-sm-4 control-label is-required">备案表：</label>
                    <div class="col-sm-8">
                        <input th:field="*{overFiling}" hidden id="contract" type="text">
                        <div style="display: inline-block;">
                            <div id="contractFileName" style="display: inline; margin-right: 5px;"></div>
                            <button onclick="beian()"
                                    class="btn btn-primary">
                                预览
                            </button>
                            <button onclick="downloadFile('contract')"
                                    class="btn btn-primary">
                                下载
                            </button>
                        </div>
                    </div>
                </div>
            </div>
        </div>


        <h4 class="form-header h4 tdiv1" style="display:none;">退回原因</h4>
        <div class="row tdiv1" style="display:none;">
            <div class="col-sm-12">
                <div class="form-group">
                    <label class="col-xs-2 control-label">批注：</label>
                    <div class="col-xs-10">
                        <textarea name="remark" required maxlength="500" class="form-control" rows="3"></textarea>
                    </div>
                </div>

            </div>
        </div>
        <h4 class="form-header h4 tdiv2" style="display:none;">退回记录</h4>
        <div class="row tdiv2" style="display:none;">
            <div class="col-sm-12">

                <div class="form-group">
                    <table id='bootstrap-table'></table>
                </div>
            </div>
        </div>

    </form>
</div>
<div class="row">
    <div class="col-sm-offset-5 col-sm-10">
        <button type="button" id="btn1" style="display:none;" class="btn btn-sm btn-primary" onclick="submitHandler()">
            <i class="fa fa-check"></i>通 过
        </button>&nbsp;
        <button type="button" id="btn2" style="display:none;" class="btn btn-sm btn-danger" onclick="submitHandlerBH()">
            <i class="fa fa-reply-all"></i>驳 回
        </button>
        <button type="button" id="btn3" style="display:none;" class="btn btn-sm btn-warning" onclick="closeItem()"><i
                class="fa fa-reply-all"></i>关 闭
        </button>
        <button type="button" id="btn4" style="display:none;" class="btn btn-sm btn-warning" onclick="retract()"><i
                class="fa fa-reply-all"></i>撤 回
        </button>
    </div>
</div>
<th:block th:include="include :: footer"/>
<th:block th:include="include :: datetimepicker-js"/>
<th:block th:include="include :: bootstrap-fileinput-js"/>
<th:block th:include="include :: select2-js"/>
<script type="text/javascript">
    function displayFileName(inputId, fileNameId) {
        const input = document.getElementById(inputId);
        const fileNameSpan = document.getElementById(fileNameId);
        if (input.value) {
            const fileName = input.value.split('/').pop(); // 获取文件名
            const parts = fileName.split('_'); // 按下划线分割
            const firstPart = parts[0]; // 下划线前的部分

            const dotParts = fileName.split('.'); // 按点分割
            const lastPart = dotParts[dotParts.length - 1]; // 点后的部分

            fileNameSpan.textContent = `${firstPart}.${lastPart}`; // 组合并显示
        } else {
            fileNameSpan.textContent = '';
        }
    }

    function chakan() {
        var c = $("#filing").val();
        // $.modal.openTab("查看合同" ,c );
        window.open(c);
        //window.location = "http://localhost:8081/profile/upload/2024/08/20/GXSZ086812_20240820090353A001.pdf";
    }

    function beian() {
        var c = $("#contract").val();
         $.modal.openTab("查看备案表" ,c );
        //window.open(c);
    }

    function downloadFile(type) {
        var c = $("#" + type).val();
        if (c) {
            var a = document.createElement("a");
            a.href = c;
            a.download = "";
            a.style.display = "none";
            document.body.appendChild(a);
            a.click();
            document.body.removeChild(a);
        } else {
            alert("网址无效");
        }

    }

    $(function () {
        var kid = $("#ktid").val();
        var options = {
            url: prefix + "/bhyy/" + kid,
            showSearch: false,
            showRefresh: false,
            showToggle: false,
            showColumns: false,
            pagination: false,
            columns: [

                {
                    field: 'createTime',
                    title: '批阅时间',
                    width: 200

                },
                {
                    field: 'uname',
                    title: '批阅人',
                    width: 100
                },
                {
                    field: 'concate',
                    title: '内容',
                    width: 500
                },
                {
                    field: 'state',
                    title: '审核状态',
                    width: 100
                }]
        };

        $.table.init(options);

        $('#bootstrap-table').on('load-success.bs.table', function (e, name, args) {
            console.log('Event Name:', name.rows);
            var a =$("#state").val();
            var role_str =$("#role").val();
            //如果是科研
            if (role_str=="sci_tesearch"){
                //批阅记录
                if(name.rows.length > 0){
                    $(".tdiv2").show();
                }
                if(a == 7 ||a == 9||a == 10){

                }else if (a==8){
                    $(".tdiv1").show();
                    $("#btn1").show();
                    $("#btn2").show();
                    $("#btn3").show();
                }else if (a == 6){
                    $(".tdiv1").show();
                    $("#btn4").show();
                    $("#btn3").show();
                }
            }else if (role_str=="research"){
                //批阅记录
                if(name.rows.length > 0){
                    $(".tdiv2").show();
                }
                if(a == 9 ||a == 6||a == 10){

                }else if (a==7){
                    $(".tdiv1").show();
                    $("#btn1").show();
                    $("#btn2").show();
                    $("#btn3").show();
                }else if (a == 13){
                    $(".tdiv1").show();
                    $("#btn4").show();
                    $("#btn3").show();
                }
            }
            else if (role_str=="teacher"){
                //批阅记录
                if(name.rows.length > 0){
                    $(".tdiv2").show();
                }

            }else if (role_str=="dept_teacher"){

                if(name.rows.length > 0){
                    $(".tdiv2").show();
                }
                if (a==13){
                    $(".tdiv1").show();
                    $("#btn1").show();
                    $("#btn2").show();
                    $("#btn3").show();
                }else if (a == 8){
                    $(".tdiv1").show();
                    $("#btn4").show();
                    $("#btn3").show();
                }
            }
            // var a = $("#state").val();
            // if (a == 7 || a == 8) {
            //     if (name.rows.length > 0) {
            //         $(".tdiv2").show();
            //     }
            //     $(".tdiv1").show();
            //     $("#btn1").show();
            //     $("#btn2").show();
            //     $("#btn3").show();
            // }

        });


        <!-- laydate示例 -->
        layui.use('laydate', function () {
            var laydate = layui.laydate;
            laydate.render({
                elem: '#laydate-demo-4',
                range: true
            });
            var startDate = laydate.render({
                elem: '#laydate-startTime',
                max: $('#laydate-endTime').val(),
                theme: 'molv',
                trigger: 'click',
                done: function (value, date) {
                    // 结束时间大于开始时间
                    if (value !== '') {
                        endDate.config.min.year = date.year;
                        endDate.config.min.month = date.month - 1;
                        endDate.config.min.date = date.date;
                    } else {
                        endDate.config.min.year = '';
                        endDate.config.min.month = '';
                        endDate.config.min.date = '';
                    }
                }
            });
            var endDate = laydate.render({
                elem: '#laydate-endTime',
                min: $('#laydate-startTime').val(),
                theme: 'molv',
                trigger: 'click',
                done: function (value, date) {
                    // 开始时间小于结束时间
                    if (value !== '') {
                        startDate.config.max.year = date.year;
                        startDate.config.max.month = date.month - 1;
                        startDate.config.max.date = date.date;
                    } else {
                        startDate.config.max.year = '';
                        startDate.config.max.month = '';
                        startDate.config.max.date = '';
                    }
                }
            });
        });
    });
</script>
<script th:inline="javascript">
    var prefix = ctx + "IntraSchPro";
    $("#form-apply-edit").validate({
        focusCleanup: true
    });

    function submitHandler() {
        //获取 URLflag
        var a = $("#urlFlag").val();
        $.operate.saveTab(prefix + "/sch_hxover", {"id": $("#ktid").val(), "urlFlag": a});
    }

    function submitHandlerBH() {
        var a = $("#urlFlag").val();
        if ($.validate.form()) {
            $.operate.saveTab(prefix + "/sch_hxoverBh", $('#form-apply-edit').serialize());
        }
    }
    function retract() {
        var urlFlag = $("#urlFlag").val();
        var state= $("#state").val();
        var id= $("#ktid").val();
        var data={"urlFlag":urlFlag,"state":state,"id":id}
        if ($.validate.form()) {
            $.operate.saveTab(prefix + "/over_retract", data);
        }
    }

    $(".file-download").fileinput({
        uploadUrl: ctx + 'common/upload',
        maxFileCount: 1,
        autoReplace: true
    }).on('fileuploaded', function (event, data, previewId, index) {
        $("input[name='" + event.currentTarget.id + "']").val(data.response.url)
    }).on('fileremoved', function (event, id, index) {
        $("input[name='" + event.currentTarget.id + "']").val('')
    })
    // 页面加载时显示文件名
    window.onload = function () {
        displayFileName('contract', 'contractFileName');
        displayFileName('filing', 'filingFileName');
    };
</script>
</body>
</html>
